<template>
  <div style="display:inline-block">
    <el-select
      :value="selectValue"
      placeholder="请选择"
      :disabled="disabled"
      :loading="isLoading"
      style="width: 100%;"
      filterable
      multiple
      @focus="sendUrl"
      @change="selChange"
    >
      <!-- // 显示什么绑定什么,等提交再转换 -->
      <el-option
        v-for="(item1, index) in opintion"
        :key="index"
        :label="item1[renderKey.renderValue]"
        :value="item1[renderKey.renderKey]"
      />
    </el-select>
  </div>
</template>

<script type="text/ecmascript-6">
// import { getCommonDataByUrl } from '@/api/commonRequest';
import { getCommonData } from '@/api/reportCenter';
export default {
  props: {
    item: {
      type: Object,
      default: () => ({})
    },

    disabled: {
      type: Boolean,
      default: false
    },

    selectValue: {
      type: Array,
      default: () => ([])
    }
  },

  data() {
    return {
      // sel: '',
      opintion: [],
      renderKey: {},
      isLoading: false
    };
  },

  created() {
    this.initData();
  },

  methods: {
    initData() {
      const { item } = this;
      // this.sel = item.myValue;
      this.opintion = item.opintion;
      // if (item.focusUrl) {
      if (JSON.stringify(item.selectViewOptions) !== '{}') {
        this.renderKey = item.selectViewOptions;
      } else {
        this.renderKey = {
          renderKey: 'lable',
          renderMapKey: 'value',
          renderValue: 'lable'
        };
      }
    },

    // 请求后台
    sendUrl() {
      const { item, opintion } = this;
      if (!opintion.length) {
        // const {
        //   focusUrl,
        //   focusUrlParams: {
        //     data,
        //     method
        //   }
        // } = item;

        this.isLoading = true;
        // getCommonDataByUrl(data, focusUrl, method).then(res => {
        if (!item.focusUrlParams || !item.focusUrl || JSON.stringify(item.focusUrlParams) === '{}') return this.$message.error('请求参数未配置');
        getCommonData(item.focusUrlParams, item.focusUrl).then(({ data: res }) => {
          this.isLoading = false;
          if (res.success) {
            this.opintion = res.data;
          }
        });
      }
    },

    selChange(item) {
      this.$emit('change', item);
    }

    // 赋值(从外面调用)
    // setSelectItem({ value = '', opintion = [] }) {
    //   // this.sel = value;
    //   if (opintion.length) {
    //     this.opintion = opintion;
    //   }
    // }

  }
};
</script>

<style lang="scss" scoped>

</style>
